<template>
  <div class="search">
    <Row :gutter="16" class="all-height">
      <Col :span="showRight ? 18 : 24" class="all-height">
        <Card class="all-height card-child-height">
          <Row class="operation code-row-bg" style="display: flex; justify-content: space-between">
            <Col span="22">
              <Button v-has="'add'" @click="add" type="primary" icon="md-add">添加</Button>
              <Button v-has="'delete'" @click="delAll" icon="md-trash">批量删除</Button>
              <Button @click="getDataList" icon="md-refresh">刷新</Button>
              <Button v-has="'input'" @click="dropImportData">导入数据</Button>
              <Button @click="dropExportData">导出所选数据</Button>
              <Button @click="dropExportAll">导出全部数据</Button>
              <Button type="dashed" @click="openTip = !openTip">{{ openTip ? '关闭提示' : '开启提示' }}</Button>
            </Col>
            <Col span="2" style="text-align: right">
              <Icon
                  color="#fff"
                  class="icon01"
                  :type="showRight ? `ios-arrow-forward` : `ios-arrow-back`"
                  @click.native="clickShowRight"
              ></Icon>

              <!--              <Button :icon="showRight?`ios-arrow-forward`:`ios-arrow-back`"-->
              <!--                      @click.native="clickShowRight"-->
              <!--                      type="primary">-->
              <!--              </Button>-->
            </Col>
          </Row>
          <Row v-show="openTip">
            <Alert show-icon>
              已选择
              <span class="select-count">{{ selectList.length }}</span>
              项
              <a class="select-clear" @click="clearSelectAll">清空</a>
            </Alert>
          </Row>
          <Row class="calc-px-height ctable">
            <Table
                v-if="data.length > 0"
                :height="height1"
                :loading="loading"
                border
                :columns="columns"
                :data="data"
                sortable="custom"
                @on-sort-change="changeSort"
                @on-selection-change="showSelect"
                @on-row-dblclick="sjclaib"
                ref="table"
            ></Table>
            <div v-else class="wh-100">
              <NoData class="wh-100"></NoData>
            </div>
          </Row>
          <!--          <Row class="calc-px-height">-->

          <!--          <Table :loading="loading" border :columns="columns" :data="data" ref="table" sortable="custom"-->
          <!--                   @on-sort-change="changeSort" @on-selection-change="changeSelect"></Table>-->
          <!--          </Row>-->
          <Row type="flex" justify="end" class="page">
            <Page
                :current="searchForm.pageNumber"
                :total="total"
                :page-size="searchForm.pageSize"
                @on-change="changePage"
                @on-page-size-change="changePageSize"
                :page-size-opts="[10, 20, 50, 100, 200]"
                size="small"
                show-total
                show-elevator
                show-sizer
            ></Page>
          </Row>
        </Card>
      </Col>
      <Col span="6" class="all-height" v-show="showRight">
        <Card class="all-height card-child-height">
          <Row v-show="!modalVisible" @keydown.enter.native="handleSearch">
            <Col span="24">
              <div class="drawer-header">
                <div class="cmr16">查询区</div>
              </div>
            </Col>
            <Col span="24">
              <Form ref="searchForm" :model="searchForm"  :label-width="labelWidth70" class="marginForm">
                <FormItem label="学校代码" prop="code">
                    <Input type="text" v-model="searchForm.code" placeholder="请输入学校代码" clearable />

                </FormItem>
                <FormItem label="院校名称" prop="name">
                    <Input type="text" v-model="searchForm.name" placeholder="请输入院校名称" clearable />

                </FormItem>
                <FormItem label="院校性质" prop="nature">
                    <Input type="text" v-model="searchForm.nature" placeholder="请输入院校性质" clearable />

                </FormItem>
                  <FormItem class="br box-key">
                  <Button @click="handleSearch" type="primary" icon="ios-search">搜索</Button>
                  <Button @click="handleReset">重置</Button>
                </FormItem>
              </Form>
            </Col>
          </Row>
          <Row class="calc-sm-height" v-show="modalVisible" style="flex-direction: row">
            <Col span="24">
              <div class="drawer-header">
                <div class="cmr16">{{ modalTitle }}</div>
              </div>
            </Col>
            <Col span="24">
              <div>
                <Form ref="form" :model="form" :rules="formValidate" :label-width="labelWidth100" 
                      class="marginForm">
                  <FormItem label="学校代码" prop="code">
                    <Input v-model="form.code" clearable placeholder="请填写相关信息" maxlength="20"/>
                  </FormItem>
                  <FormItem label="院校名称" prop="name">
                    <Input v-model="form.name" clearable placeholder="请填写相关信息" maxlength="50"/>
                  </FormItem>
                  <FormItem label="院校所在地" prop="location">
                    <Input v-model="form.location" clearable placeholder="请填写相关信息" maxlength="50"/>
                  </FormItem>
                  <FormItem label="院校性质" prop="nature">
                      <Input v-model="form.nature" placeholder="请输入院校性质" clearable />
                  </FormItem>
                  <FormItem label="隶属单位" prop="affiliatedUnit">
                    <Input v-model="form.affiliatedUnit" clearable placeholder="请填写相关信息" maxlength="50"/>
                  </FormItem>
                  <FormItem label="办学类型" prop="type">
                    <Input v-model="form.type" clearable placeholder="请填写相关信息" maxlength="50"/>
                  </FormItem>
                  <FormItem label="办学层次" prop="level">
                    <Input v-model="form.level" clearable placeholder="请填写相关信息" maxlength="50"/>
                  </FormItem>
                  <FormItem label="is211" prop="isProject211">
                      <Select v-model="form.isProject211" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="is985" prop="isProject985">
                      <Select v-model="form.isProject985" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="一流大学" prop="firstClassUni">
                      <Select v-model="form.firstClassUni" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="一流学科" prop="firstClassDiscipline">
                      <Select v-model="form.firstClassDiscipline" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="独立学院" prop="independentCollege">
                      <Select v-model="form.independentCollege" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="新增本科" prop="newAddedUndergraduate">
                      <Select v-model="form.newAddedUndergraduate" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="示范高职" prop="demonstrationVoc">
                      <Select v-model="form.demonstrationVoc" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="骨干高职" prop="backboneVoc">
                      <Select v-model="form.backboneVoc" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="科研机构" prop="researchInstitution">
                      <Select v-model="form.researchInstitution" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="民办院校" prop="privateInstitution">
                      <Select v-model="form.privateInstitution" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="高水平学校" prop="highLvSchool">
                      <Select v-model="form.highLvSchool" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="高水平专业院校" prop="highLvProCollege">
                      <Select v-model="form.highLvProCollege" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="培养专科" prop="vocationalEdu">
                      <Select v-model="form.vocationalEdu" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="培养本科" prop="undergraduateEdu">
                      <Select v-model="form.undergraduateEdu" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="培养硕士" prop="graduateEdu">
                      <Select v-model="form.graduateEdu" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="培养博士" prop="doctorEdu">
                      <Select v-model="form.doctorEdu" placeholder="请选择" >
                      <Option value="true">是</Option>
                      <Option value="false">否</Option>
                    </Select>
                  </FormItem>
                  <FormItem label="是否开通市场" >
                    <Select v-model="form.isOpen" placeholder="请选择" >
                      <Option :value="1">是</Option>
                      <Option :value="0">否</Option>
                    </Select>
                  </FormItem>
                </Form>
              </div>
            </Col>
            <div class="br right-bottom-edit">
              <Button type="text" @click="modalVisible = false">取消</Button>
              <div v-if="modalType == 0" style="display: inline">
                <Button v-has="'add'" type="primary" :loading="submitLoading" @click="handleSubmit">提交</Button>
              </div>
              <div v-if="modalType == 1" style="display: inline">
                <Button v-has="'edit'" type="primary" :loading="submitLoading" @click="handleSubmit">提交</Button>
              </div>
            </div>
          </Row>
        </Card>
      </Col>
    </Row>
    <!--    <Modal :title="modalTitle" v-model="modalVisible" :mask-closable='false' :width="720">-->

    <!--    </Modal>-->
    <Drawer title="导入数据" closable v-model="importModalVisible" class="cw1000">
      <div style="display: flex; justify-content: space-between; align-items: center">
        <Upload action :before-upload="beforeUploadImport" accept=".xls, .xlsx">
          <Button :loading="reading" icon="ios-cloud-upload-outline" class="cmr10" >上传Excel文件</Button>
          <span v-if="uploadfile.name">当前选择文件：{{ uploadfile.name }}</span>
        </Upload>
        <Button @click="clearImportData" icon="md-trash">清空数据</Button>
      </div>
      <Alert type="warning" show-icon>
        导入前请下载查看导入模版数据文件查看所需字段及说明，确保数据格式正确，不得修改列英文名称
      </Alert>
      <Table :columns="importColumns" border :height="height" :data="importTableData" ref="importTable"></Table>
      <div class="drawer-footer" style="display: flex;justify-content:space-between">
        <Button @click="downloadTemple" type="info">下载导入模板</Button>
        <div class="wrapper01">
          <Button @click="importModalVisible = false">关闭</Button>
          <Button :loading="importLoading" :disabled="importTableData.length <= 0" @click="importData" class="cml8"
                   type="primary">
            确认导入
            <span v-if="importTableData.length > 0">{{ importTableData.length }} 条数据</span>
          </Button>
        </div>
      </div>
    </Drawer>

    <!-- 自定义导出数据 -->
    <Modal v-model="exportModalVisible" :title="exportTitle" :loading="loadingExport" @on-ok="exportCustomData">
      <Form ref="exportForm" :label-width="labelWidth100">
        <FormItem label="导出文件名">
          <Input v-model="filename"/>
        </FormItem>
        <FormItem label="自定义导出列">
          <CheckboxGroup v-model="chooseColumns">
            <Checkbox v-for="(item, i) in exportColumns" :label="item.title" :key="i" :value="item.checked"
                      :disabled="item.disabled"></Checkbox>
          </CheckboxGroup>
        </FormItem>
      </Form>
    </Modal>
  </div>
</template>

<script>
import {shortcuts} from '@/libs/shortcuts';
import excel from '@/libs/excel';
import {schoolCodeColumns, schoolCodeData} from './importSchoolCodeTemplate';
import {getAllSchoolData, importSchoolData} from '@/api';
import dict from '@/views/my-components/xboot/dict';
// import {exportColumn} from "@/views/sys/user-manage/exportColumn";
// 指定导出列数据
import {exportColumn} from './exportColumn';
import NoData from "@/components/NoData.vue";

export default {
  name: 'schoolCode',
  components: {
    NoData,
    dict
  },
  data() {
    return {
      labelWidth100: 100,
      
      labelWidth70: 70,
      openSearch: true, // 显示搜索
      openTip: true, // 显示提示
      loading: true, // 表单加载状态
      modalType: 0, // 添加或编辑标识
      modalVisible: false, // 添加或编辑显示
      modalTitle: '', // 添加或编辑标题
      exportModalVisible: false,
      exportTitle: '确认导出',
      filename: '学校信息数据',
      loadingExport: true,
      chooseColumns: [],
      exportColumns: exportColumn,
      exportType: '',
      exportData: [],
      height1: 0,
      searchForm: {
        // 搜索框初始化对象
        pageNumber: 1, // 当前页数
        pageSize: 50, // 页面大小
        sort: 'createTime', // 默认排序字段
        order: 'desc' // 默认排序方式
      },
      form: {
        // 添加或编辑表单对象初始化数据
        code: '',
        name: '',
        location: '',
        nature: '',
        affiliatedUnit: '',
        type: '',
        level: '',
        isProject211: '',
        isProject985: '',
        firstClassUni: '',
        firstClassDiscipline: '',
        independentCollege: '',
        newAddedUndergraduate: '',
        demonstrationVoc: '',
        backboneVoc: '',
        researchInstitution: '',
        privateInstitution: '',
        highLvSchool: '',
        highLvProCollege: '',
        vocationalEdu: '',
        undergraduateEdu: '',
        graduateEdu: '',
        doctorEdu: '',
        isOpen:0
      },
      // 表单验证规则
      formValidate: {
        // 表单验证规则
        code: [{required: true, message: '请输入学校代码', trigger: 'change'}],
        name: [{required: true, message: '请输入院校名称', trigger: 'change'}]
        // location: [
        //   {required: true, message: '请输入院校所在地', trigger: 'change'},
        // ],
        // nature: [
        //   {required: true, message: '请输入院校性质', trigger: 'change'},
        // ],
        // affiliatedUnit: [
        //   {required: true, message: '请输入隶属单位', trigger: 'change'},
        // ],
        // type: [
        //   {required: true, message: '请输入办学类型', trigger: 'change'},
        // ],
        // level: [
        //   {required: true, message: '请输入办学层次', trigger: 'change'},
        // ],
        // isProject211: [
        //   {required: true, message: '请选择是否211大学', trigger: 'change'},
        // ],
        // isProject985: [
        //   {required: true, message: '请选择是否985大学', trigger: 'change'},
        // ],
        // firstClassUni: [
        //   {required: true, message: '请选择一流大学', trigger: 'change'},
        // ],
        // firstClassDiscipline: [
        //   {required: true, message: '请选择一流学科', trigger: 'change'},
        // ],
        // independentCollege: [
        //   {required: true, message: '请选择独立学院', trigger: 'change'},
        // ],
        // newAddedUndergraduate: [
        //   {required: true, message: '请选择新增本科', trigger: 'change'},
        // ],
        // demonstrationVoc: [
        //   {required: true, message: '请选择示范高职', trigger: 'change'},
        // ],
        // backboneVoc: [
        //   {required: true, message: '请选择骨干高职', trigger: 'change'},
        // ],
        // researchInstitution: [
        //   {required: true, message: '请选择科研机构', trigger: 'change'},
        // ],
        // privateInstitution: [
        //   {required: true, message: '请选择民办院校', trigger: 'change'},
        // ],
        // highLvSchool: [
        //   {required: true, message: '请选择高水平学校', trigger: 'change'},
        // ],
        // highLvProCollege: [
        //   {required: true, message: '请选择高水平专业院校', trigger: 'change'},
        // ],
        // vocationalEdu: [
        //   {required: true, message: '请选择培养专科', trigger: 'change'},
        // ],
        // undergraduateEdu: [
        //   {required: true, message: '请选择培养本科', trigger: 'change'},
        // ],
        // graduateEdu: [
        //   {required: true, message: '请选择培养硕士', trigger: 'change'},
        // ],
        // doctorEdu: [
        //   {required: true, message: '请选择培养博士', trigger: 'change'},
        // ],
        // mobile: [
        //   {required: true, message: '请输入手机号', trigger: 'change'},
        // ],
        // email: [
        //   {required: true, message: '请输入邮箱地址', trigger: 'change'},
        //   {type: 'email', message: '邮箱格式不正确'},
        // ],
      },
      submitLoading: false, // 添加或编辑提交状态
      selectList: [], // 多选数据
      columns:[],
      columns_1: Object.freeze([
        // 表头
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        {
          type: 'index',
          title: '序号',
          width: 60,
          align: 'center'
        },
        {
          title: '院校代码',
          key: 'code',
          minWidth: 80,
          sortable: false
        },
        {
          title: '院校名称',
          key: 'name',
          minWidth: 180,
          sortable: false
        },
        {
          title: '院校所在地',
          key: 'location',
          minWidth: 120,
          sortable: false
        },
        {
          title: '院校性质',
          key: 'nature',
          minWidth: 100,
          sortable: false
        },
        {
          title: '隶属单位',
          key: 'affiliatedUnit',
          minWidth: 80,
          sortable: false
        },
        {
          title: '办学类型',
          key: 'type',
          minWidth: 80,
          sortable: false
        },
        {
          title: '办学层次',
          key: 'level',
          minWidth: 80,
          sortable: false
        },
        {
          title: 'is211',
          key: 'isProject211',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.isProject211;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: 'is985',
          key: 'isProject985',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.isProject985;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '一流大学',
          key: 'firstClassUni',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.firstClassUni;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '一流学科',
          key: 'firstClassDiscipline',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.firstClassDiscipline;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '独立学院',
          key: 'independentCollege',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.independentCollege;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '新增本科',
          key: 'newAddedUndergraduate',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.newAddedUndergraduate;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '示范高职',
          key: 'demonstrationVoc',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.demonstrationVoc;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '骨干高职',
          key: 'backboneVoc',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.backboneVoc;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '科研机构',
          key: 'researchInstitution',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.researchInstitution;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '民办院校',
          key: 'privateInstitution',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.privateInstitution;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '高水平学校',
          key: 'highLvSchool',
          minWidth: 100,
          sortable: false,
          render: (h, {row}) => {
            const value = row.highLvSchool;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '高水平专业院校',
          key: 'highLvProCollege',
          minWidth: 120,
          sortable: false,
          render: (h, {row}) => {
            const value = row.highLvProCollege;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '培养专科',
          key: 'vocationalEdu',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.vocationalEdu;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '培养本科',
          key: 'undergraduateEdu',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.undergraduateEdu;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '培养硕士',
          key: 'graduateEdu',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.graduateEdu;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '培养博士',
          key: 'doctorEdu',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.doctorEdu;
            let text = '';
            if (value === '1' || value === 'true') {
              text = '是';
            } else if (value === '0' || value === 'false') {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '是否开通市场',
          key: 'isOpen',
          minWidth: 80,
          sortable: false,
          render: (h, {row}) => {
            const value = row.isOpen;
            let text = '';
            if (value ) {
              text = '是';
            } else  {
              text = '否';
            }
            return h('span', null, text);
          }
        },
        {
          title: '操作',
          key: 'action',
          align: 'center',
          width: 150,
          fixed: 'right',
          render: (h, params) => {
            return h('div', [
              h(
                  'a',
                  {
                    style: {
                      display: this.hasPermission(this, 'edit') ? 'inline-block' : 'none'
                    },
                    on: {
                      click: () => {
                        this.edit(params.row);
                      }
                    }
                  },
                  '编辑'
              ),
              h('Divider', {
                props: {
                  type: 'vertical'
                }
              }),
              h(
                  'a',
                  {
                    style: {
                      display: this.hasPermission(this, 'delete') ? 'inline-block' : 'none'
                    },
                    on: {
                      click: () => {
                        this.remove(params.row);
                      }
                    }
                  },
                  '删除'
              )
            ]);
          }
        }
      ]),
      data: [], // 表单数据
      total: 0, // 表单数据总数
      pageNumber: 1, // 当前页数
      pageSize: 50, // 页面大小
      importModalVisible: false,
      importTableData: [],
      importColumns: [],
      uploadfile: {
        name: ''
      },
      reading: false,
      importLoading: false,
      height: 510,
      tempColumns: schoolCodeColumns,
      tempData: schoolCodeData,
      showRight: true
    };
  },
  methods: {
    tableheig() {
      var bbb = document.getElementsByClassName('calc-px-height')[0].scrollHeight;
      var aaa = document.getElementsByClassName('calc-px-height')[0].children[0].children[0].children[1];
      var ccc = document.getElementsByClassName('calc-px-height')[0].children[0].children[0].children[0].scrollHeight;
      var ddd = bbb - ccc;
      console.log(bbb, '00000000000000');
      aaa.style.height = `${ddd}px`;

      if (this.searchForm.pageSize === 10) {
        this.height1 = 0;
      } else {
        this.height1 = document.getElementsByClassName('calc-px-height')[0].scrollHeight;
        if (this.total < this.searchForm.pageNumber * this.searchForm.pageSize) {
          var r = (this.searchForm.pageNumber - 1) * this.searchForm.pageSize;
          var a = this.total - r;
          var s = a * 43 + 65;
          if (s < this.height1) {
            this.height1 = 0;
          }
        }
      }
      if (this.total < 10) {
        this.height1 = 0;
      }
    },
    init() {
      this.getDataList();
      // 初始化导出列数据
      let array = [];
      this.exportColumns.forEach(e => {
        // 指定列限制权限
        if (!this.getStore('roles').includes('ROLE_ADMIN') && e.key == 'mobile') {
          e.title = '[无权导出] ' + e.title;
          e.disabled = true;
        } else {
          e.disabled = false;
        }
        array.push(e.title);
      });
      this.chooseColumns = array;
    },
    // 显示隐藏右侧区域
    clickShowRight() {
      this.showRight = !this.showRight;
    },
    downloadTemple() {
      let title = [];
      let key = [];
      schoolCodeColumns.forEach(e => {
        title.push(e.title);
        key.push(e.key);
      });
      const params = {
        title: title,
        key: key,
        data: schoolCodeData,
        autoWidth: true,
        filename: '导入学校代码数据模版'
      };
      excel.export_array_to_excel(params);
      // window.location.href = process.env.BASE_URL + "字典导入模板.xlsx";
    },
    handleSearch() {
      this.searchForm.pageNumber = 1;
      this.searchForm.pageSize = 50;
      this.getDataList();
    },
    clearImportData() {
      this.importTableData = [];
      this.importColumns = [];
      this.uploadfile = {};
    },
    //导出所选数据
    dropExportData() {
      if (this.selectList.length <= 0) {
        this.$Message.warning('您还未选择要导出的数据');
        return;
      }
      this.exportType = 'part';
      this.exportModalVisible = true;
      this.exportTitle = '确认导出 ' + this.selectList.length + ' 条数据';
      // "确认导出 " + this.selectList.length + " 条数据(付费)";
    },
    //导出全部数据
    dropExportAll() {
      this.exportType = 'all';
      this.exportModalVisible = true;
      this.exportTitle = '确认导出全部 ' + this.total + ' 条数据';
      // this.exportTitle = "确认导出全部 " + this.total + " 条数据(付费)";
      getAllSchoolData().then(res => {
        if (res.success) {
          this.exportData = res.result;
        }
      });
    },
    exportCustomData() {
      if (this.filename === '') {
        this.filename = '学校信息数据';
      }
      // 判断勾选导出列
      let array = [];
      this.exportColumns.forEach(e => {
        this.chooseColumns.forEach(c => {
          if (e.title == c && !e.disabled) {
            array.push(e);
          }
        });
      });
      this.exportColumns = array;
      this.exportModalVisible = false;
      let title = [];
      let key = [];
      this.exportColumns.forEach(e => {
        title.push(e.title);
        key.push(e.key);
      });
      const params = {
        title: title,
        key: key,
        data: this.exportData,
        autoWidth: true,
        filename: this.filename
      };
      excel.export_array_to_excel(params);
    },
    showSelect(e) {
      this.exportData = e;
      this.selectList = e;
    },
    dropImportData() {
      this.importModalVisible = true;
    },
    beforeUploadImport(file) {
      this.uploadfile = file;
      const fileExt = file.name.split('.').pop().toLocaleLowerCase();
      if (fileExt == 'xlsx' || fileExt == 'xls') {
        this.readFile(file);
        this.file = file;
      } else {
        this.$Notice.warning({
          title: '文件类型错误',
          desc: '所选文件‘ ' + file.name + ' ’不是EXCEL文件，请选择后缀为.xlsx或者.xls的EXCEL文件。'
        });
      }
      return false;
    },
    // 读取文件
    readFile(file) {
      this.reading = true;
      const reader = new FileReader();
      reader.readAsArrayBuffer(file);
      reader.onerror = e => {
        this.reading = false;
        // this.$Message.error("文件读取出错");
        this.$Message.error({
          content: '文件读取出错',
          duration: 5,
          closable: true
        });
      };
      reader.onload = e => {
        const data = e.target.result;
        const {header, results} = excel.read(data, 'array');
        const tableTitle = header.map(item => {
          return {title: item, key: item, minWidth: 130, align: 'center'};
        });
        this.importTableData = results;
        this.importColumns = tableTitle;
        this.reading = false;
        this.$Message.success('读取数据成功');
      };
    },
    importData() {
      let params = this.importTableData.map(item => {
        return {
          code: item['学校代码'],
          name: item['院校名称'],
          location: item['院校所在地'],
          nature: item['院校性质'],
          affiliatedUnit: item['隶属单位'],
          type: item['办学类型'],
          level: item['办学层次'],
          isProject211: item['is211'],
          isProject985: item['is985'],
          firstClassUni: item['一流大学'],
          firstClassDiscipline: item['一流学科'],
          independentCollege: item['独立学院'],
          newAddedUndergraduate: item['新增本科'],
          demonstrationVoc: item['示范高职'],
          backboneVoc: item['骨干高职'],
          researchInstitution: item['科研机构'],
          privateInstitution: item['民办院校'],
          highLvSchool: item['高水平学校'],
          highLvProCollege: item['高水平专业院校'],
          vocationalEdu: item['培养专科'],
          undergraduateEdu: item['培养本科'],
          graduateEdu: item['培养硕士'],
          doctorEdu: item['培养博士'],
          isOpen: item['是否开通市场']
        };
      });
      this.importLoading = true;
      importSchoolData(params).then(res => {
        this.importLoading = false;
        if (res.success) {
          this.importModalVisible = false;
          this.getDataList();
          this.$Modal.info({
            title: '导入结果',
            content: res.message
          });
        }
      });
    },
    changePage(v) {
      this.searchForm.pageNumber = v;
      this.getDataList();
      this.clearSelectAll();
    },
    changePageSize(v) {
      this.searchForm.pageSize = v;
      this.getDataList();
    },
    handleReset() {
      this.$refs.searchForm.resetFields();
      this.searchForm.pageNumber = 1;
      this.searchForm.pageSize = 50;
      // 重新加载数据
      this.getDataList();
    },
    changeSort(e) {
      this.searchForm.sort = e.key;
      this.searchForm.order = e.order;
      if (e.order === 'normal') {
        this.searchForm.order = '';
      }
      this.getDataList();
    },
    clearSelectAll() {
      this.$refs.table.selectAll(false);
    },
    changeSelect(e) {
      this.selectList = e;
    },
    getDataList() {
      this.loading = true;
      // 带多条件搜索参数获取表单数据 请自行修改接口
      this.postRequest('/schoolCode/getByPage', this.searchForm).then(res => {
        this.loading = false;
        if (res.success) {
          this.data = res.result.records;
          this.total = res.result.total;
          this.tableheig();
          if (this.data.length == 0 && this.searchForm.pageNumber > 1) {
            this.searchForm.pageNumber -= 1;
            this.getDataList();
          }
        }
      });
      // 以下为模拟数据
      //this.data = [
      //];
      this.total = this.data.length;
      this.loading = false;
    },
    handleSubmit() {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.submitLoading = true;
          if (this.modalType === 0) {
            // 添加 避免编辑后传入id等数据 记得删除
            delete this.form.id;
            this.postRequest('/schoolCode/insertOrUpdate', this.form).then(res => {
              this.submitLoading = false;
              if (res.success) {
                this.$Message.success('操作成功');
                this.getDataList();
                this.modalVisible = false;
              }
            });
            // 模拟请求成功
            // this.submitLoading = false;
            // this.$Message.success("操作成功");
            // this.getDataList();
            // this.modalVisible = false;
          } else {
            // 编辑
            this.postRequest('/schoolCode/insertOrUpdate', this.form).then(res => {
              this.submitLoading = false;
              if (res.success) {
                this.$Message.success('操作成功');
                this.getDataList();
                this.modalVisible = false;
              }
            });
            // 模拟请求成功
            // this.submitLoading = false;
            // this.$Message.success("操作成功");
            // this.getDataList();
            // this.modalVisible = false;
          }
        }
      });
    },
    add() {
      this.modalType = 0;
      this.modalTitle = '添加';
      this.$refs.form.resetFields();
      delete this.form.id;
      this.modalVisible = true;
    },
    sjclaib(v) {
      this.showRight = true;
      this.modalType = 1;
      this.modalTitle = '编辑';
      this.$refs.form.resetFields();
      // 转换null为""
      for (let attr in v) {
        if (v[attr] === null) {
          v[attr] = '';
        }
      }
      let str = JSON.stringify(v);
      let data = JSON.parse(str);
      this.form = data;
      this.modalVisible = true;
    },
    edit(v) {
      this.modalType = 1;
      this.modalTitle = '编辑';
      this.$refs.form.resetFields();
      // 转换null为""
      for (let attr in v) {
        if (v[attr] === null) {
          v[attr] = '';
        }
      }
      let str = JSON.stringify(v);
      let data = JSON.parse(str);
      this.form = data;
      console.log(this.form);
      this.modalVisible = true;
    },
    remove(v) {
      let param = {
        ids: v.id
      };
      this.$Modal.confirm({
        title: '确认删除',
        // 记得确认修改此处
        content: '您确认要删除该条数据?',
        loading: true,
        onOk: () => {
          // 删除
          this.postRequest('/schoolCode/delByIds', param).then(res => {
            this.$Modal.remove();
            if (res.success) {
              this.$Message.success('操作成功');
              this.clearSelectAll();
              this.getDataList();
            }
          });
          // 模拟请求成功
          // this.$Message.success("操作成功");
          // this.clearSelectAll();
          // this.$Modal.remove();
          // this.getDataList();
        }
      });
    },
    delAll() {
      if (this.selectList.length <= 0) {
        this.$Message.warning('您还未选择要删除的数据');
        return;
      }
      this.$Modal.confirm({
        title: '确认删除',
        content: '您确认要删除所选的 ' + this.selectList.length + ' 条数据?',
        loading: true,
        onOk: () => {
          let ids = '';
          this.selectList.forEach(function (e) {
            ids += e.id + ',';
          });
          ids = ids.substring(0, ids.length - 1);
          // 批量删除
          this.postRequest('/schoolCode/delByIds', {ids: ids}).then(res => {
            this.$Modal.remove();
            if (res.success) {
              this.$Message.success('操作成功');
              this.clearSelectAll();
              this.getDataList();
            }
          });
          // 模拟请求成功
          // this.$Message.success("操作成功");
          // this.$Modal.remove();
          // this.clearSelectAll();
          // this.getDataList();
        }
      });
    },
    onRestWindow() {
        this.columns = this.restTableCellWidth(this.columns_1)
    
        this.labelWidth70 = this.searchLabelWidth(this.labelWidth70)
        this.labelWidth100 = this.searchLabelWidth(this.labelWidth100)
    },
  },
  mounted() {
    this.onRestWindow()
    window.addEventListener('resize',this.onRestWindow)
    this.init();
  },
  beforeDestroy() {
      window.removeEventListener('resize',this.onRestWindow)
  },
};
</script>
<style lang="less">
// 建议引入通用样式 具体路径自行修改 可删除下面样式代码
@import '../../personInfo.less';

@import '../../../styles/table-common.less';

.search {
  .operation {
    margin-bottom: 2vh;
  }

  .select-count {
    font-weight: 600;
    color: #40a9ff;
  }

  .select-clear {
    margin-left: 10px;
  }

  .page {
    margin-top: 2vh;
  }

  .drop-down {
    margin-left: 5px;
  }
}
</style>
<style scoped lang="less">
// 重构样式
/deep/ .ivu-form-item-label{
    display: flex;
    justify-content: right;
    width: 170px !important;
}
/deep/ .ivu-form-item {
    width: 100%;
    margin-bottom: 0.1rem;
    margin-right: 0 !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
/deep/ .ivu-form-item-content {
    width: 100% !important;
    margin-left: 0 ! important;
}
/deep/ .ivu-select {
    width: 100% !important;
}
/deep/ .ivu-date-picker {
    width: 100% !important;
}
/deep/ .br {
    margin-top: 15px;
    bottom: 0.12rem !important;
    .ivu-form-item-content {
        display: flex;
    }
}
/deep/ .ivu-input-type-textarea,/deep/ .ivu-input {
    height: calc(100% - 7px) !important;
}
.flex-1 {
    height: 100%;
}
/deep/ .ivu-drawer-body {
    overflow: hidden;
    .d-flex-align-center {
        height: fit-content !important;
        margin-left: 0 !important;
        justify-content: right;
        box-sizing: border-box;
        padding-right: 7px;
    }
}
.box-key {
    /deep/ .ivu-form-item-content {
        margin-left: 110px !important;
    }
}
</style>
<style lang="less" scoped>
.icon01 {
  background: rgb(45, 154, 244); 
  border-radius: 50%; 
  padding: 3px
}
.cmr16 {
  margin-right: 16px
}
.cw200 {
  width: 200px
}

.cml-35 {
  margin-left: -35px
}
.cw169 {
  width: 169px
}
.cmr10 {
  margin-right: 10px
}
.cml {

  margin-left: 8px
}
.wrapper01 {

  position: absolute; right: 15px; display: inline-block
}

.cw1000 {
  /deep/.ivu-drawer {
    width: 1000px !important;
  }
}


.ctable {
  
  @media (max-width: 1920px) {
    /deep/ .ivu-table .ivu-table-fixed-right{
        height: 98% !important;
    }
    /deep/ .ivu-table .ivu-table-fixed-right  .ivu-table-fixed-body {
        height: 93% !important;
    }
    /deep/.ivu-table-body {
        height: 94%;
    }
}

@media (min-width: 1921px) and (max-width: 3440px) {
    /deep/.ivu-table-body {
        height: 93%;
    }

}

}
</style>